class ServiceCfEditController {
    constructor($rootScope, $scope, $cookieStore, $timeout, $state, ngDialog, dialogService, ServiceService, fileReader, iRunner){

        var vm = this;

        vm.$rootScope     = $rootScope;
        vm.$cookieStore   = $cookieStore;
        vm.$timeout       = $timeout;
        vm.$state         = $state;
        vm.ngDialog       = ngDialog;
        vm.dialogService  = dialogService;
        vm.ServiceService = ServiceService;
        vm.fileReader     = fileReader;
        vm.iRunner        = iRunner;

        //默认为没有编辑过证书
        vm.editFlag = false;

        // 获取当前证书信息
        vm.ServiceService.postServiceCoursecert(vm.$cookieStore.get('access_token'), vm.$state.params.course_id)
        .then(function(data) {
            // 成功调用（证书村子的情况下）
            if (data.code==0) {
                //显示证书
                vm.imageSrc = "../" + data.data.temp_file;
                //判断是否编辑过证书
                if(data.data.print_info != "") {
                    vm.editFlag = true;
                    //预览链接
                    vm.previewLink = "/dashboard/service/coursecert?course_id=" + vm.$state.params.course_id + "&op=preview&access-token=" + vm.$cookieStore.get('access_token');
               }

            } else{
                vm.ngDialog.open({
                    template: '<p>未找到证书信息</p>',
                    className: 'ngdialog-theme-default ngdialog-alert',
                    plain: true
                });
            }
            // 登录信息已过期, 请重新登录
            data.code==-1001&&vm.dialogService.error(data.message, true);
            console.log(data)
        }, function(data) {
            console.log('error')
        });

        // 生成颜色改变控件
        var picker = new jscolor(document.getElementById("color"));

        //初始化字体颜色为黑色
        $(".jscolor").val("000000");

        //添加初始化拖曳效果
        $(function() {
           $( ".draggable" ).draggable({ containment: "#containment-wrapper", scroll: false });
        });

        // 点击按钮添加新元素
        $(".create").on("click", function() {

            //使画面上所有元素不可编辑
            $(".edit-display-block").removeClass("edit-display-block");
            var html = "<div class='ui-widget-content draggable' style='top:" + $("#containment-wrapper")[0].scrollTop + "px; left:" + $("#containment-wrapper")[0].scrollLeft + "px' data-id='" + $(this).attr("id") + "'>" +
                        "<img src='images/close.ico' class='close'>" +
                        "<img src='images/edit.ico' class='edit edit-display-none edit-display-block'>" +
                        "<p style='color:#" + $(".jscolor").val() + "; font-size:" + $(".fontSize").val() +"'>" +
                        $(this).attr("data-val") +
                        "</p>" +
                        "</div>";

            $("#containment-wrapper").append(html);

            //控件右上方划入页面
            $($(".edit-display-block")[0].parentElement).animate({
                left: $("#containment-wrapper")[0].scrollLeft +50,
                top: $("#containment-wrapper")[0].scrollTop + 50,
                opacity: 'show'
            }, 500);

            //设置（当前）按钮不可按下
            // this.disabled = true;
            //清空内容文本框里面的内容
            $('.value').val(""); 
            

            $(function() {
                $( ".draggable" ).draggable({ containment: "#containment-wrapper", scroll: false });
            });
        });

        //点击关闭按钮移除元素
        $('#containment-wrapper').delegate(".close", "click", function() {

            $("#" + $(this.parentElement).attr("data-id"))[0].disabled = false;
            $(this.parentElement).remove();
        });

        //点击元素编辑状态
        $('#containment-wrapper').delegate(".draggable", "click", function() {
            $(".edit-display-block").removeClass("edit-display-block");
            $(this).find(".edit").addClass("edit-display-block");
        });

        //改变元素内容
        $('.value').bind('input propertychange', function() { 
            $(".edit-display-block").next("p")[0].innerHTML = ($(".value").val());
        });


        // 监听字体颜色变化
        $('.jscolor').attrchange({
            trackValues: !0,
            callback: function() {
                $(".edit-display-block").next("p").css("color", "#" + $(".jscolor").val());
                console.log("234234");
            }
        });

        //改变字体大小
        $(".fontSize").on("click", function() {
            $(".edit-display-block").next("p").css("font-size", $(".fontSize").val());
        });

        vm.save = function() {

            if ($(".draggable").length == 0) {
                vm.ngDialog.open({
                    template: '<p>请添加证书内容</p>',
                    className: 'ngdialog-theme-default ngdialog-alert',
                    plain: true
                });

            } else{
                //保存证书编辑信息
                var infoList = [];
                for (var i = 0; i < $(".draggable").length; i++) {
                    var color = $(".draggable")[i].children[2].style.color;
                    var R = color.substr(color.indexOf("(") + 1, color.indexOf(",") - (color.indexOf("(") + 1));
                    color = color.substr(color.indexOf(",") + 2);
                    var G = color.substr(0, color.indexOf(","));
                    color = color.substr(color.indexOf(",") + 2);
                    var B = color.substr(0, color.indexOf(")"));

                    var info = {
                        "font_size" : parseInt($($(".draggable")[i]).find("p")[0].style.fontSize.substr(0, $($(".draggable")[i]).find("p")[0].style.fontSize.length - 2)),
                        "XPoint": parseInt($(".draggable")[i].style.left.substr(0, $(".draggable")[i].style.left.length - 2)) + 10,
                        "YPoint": parseInt($(".draggable")[i].style.top.substr(0, $(".draggable")[i].style.top.length - 2)) + $(".draggable")[0].children[2].clientHeight + 25,
                        "position": "left",
                        "type": $($(".draggable")[i]).attr("data-id"),
                        "color": [
                                parseInt(R),
                                parseInt(G),
                                parseInt(B)
                            ]
                    };
                    infoList.push(info);

                }

                //参数
                var params = {
                    course_id: vm.$state.params.course_id,
                    op: "save",
                    print_info: JSON.stringify(infoList)
                }

                // 保存证书编辑信息
                vm.ServiceService.postServiceCoursecertSave(params, vm.$cookieStore.get('access_token'), vm.$state.params.course_id)
                .then(function(data) {

                    if (data.code == 0) {
                        //显示预览按钮
                        vm.editFlag = true;
                        //预览链接
                        vm.previewLink = "/dashboard/service/coursecert?course_id=" + vm.$state.params.course_id + "&op=preview&access-token=" + vm.$cookieStore.get('access_token');
                        //显示保存成功信息
                        vm.ngDialog.open({
                            template: '<p>保存成功</p>',
                            className: 'ngdialog-theme-default ngdialog-alert',
                            plain: true
                        });
                    } else {
                        vm.ngDialog.open({
                            template: '<p>' + data.message + '</p>',
                            className: 'ngdialog-theme-default ngdialog-alert',
                            plain: true
                        });

                    }
                    // 登录信息已过期, 请重新登录
                    data.code==-1001&&vm.dialogService.error(data.message, true);
                    console.log(data)
                }, function(data) {
                    console.log('error')
                });
            }
        }

    }
}

ServiceCfEditController.$inject = ['$rootScope', '$scope', '$cookieStore', '$timeout', '$state', 'ngDialog', 'dialogService', 'ServiceService', 'fileReader', 'iRunner']; 

export default ServiceCfEditController;